/**
 * 入参
 *
 */
import React, { PureComponent } from 'react';
import { Tabs } from 'antd';
import style from './index.less';
import ProgrammeSelectC from './assetComps/programmeSelectC';
import CommonComp from './assetComps/CommonComp';
import ScreeningScheme from './screeningScheme';
import { connect } from 'dva';
import { ContentPackage } from '../../../comps';

const { TabPane } = Tabs;
class AssetPreparation extends PureComponent {
  state = {
    tabType: undefined, //
    indexData: [], //基础数据 数组 tab的整个条件
    isReset: false, //是否重置
    detail: undefined, //方案详情
    pageStatus: 1, //默认新增页 1 列表页2
    loadingOff: false, //获取筛选条件的相关条件标志位
  };
  childRefs = [];

  UNSAFE_componentWillMount() {
    this.getIndex(); ////获取指标相关的基础数据 筛选条件里的数据
  }

  //获取方案详情 详情就是筛选设置的内容 需要回填条件设置的复选框
  getDetail = (data) => {
    this.setState({
      tabType: data.type,
      detail: data ? data.index : undefined,
    });
    this.childRefs.map((item) => {
      //将筛选结果清空
      if (Object.keys(item)[0] == data.type) item[Object.keys(item)[0]].setState({ settingInfo: undefined });
    });
  };

  //清空按钮点击 主页面开始恢复到初始化状态
  onClear = () => {
    const { indexData } = this.state;
    this.childRefs.map((item) => {
      item[Object.keys(item)[0]].reset();
    });
    this.setState({
      tabType: indexData[0].value,
      detail: undefined, //方案详情
    });
  };

  //获取指标相关的基础数据 筛选条件里的数据
  getIndex = () => {
    this.props.dispatch({
      type: 'AssetPreparationM/loadIndicatorList',
      payload: {},
      callback: (data) => {
        this.setState({
          indexData: data || undefined,
          tabType: data && data.length ? data[0].value : undefined,
          loadingOff: true, //筛选条件全部获取到了
        });
      },
    });
  };

  settingInfo = () => {
    var currentRef;
    this.childRefs.map((item) => {
      if (Object.keys(item)[0] == this.state.tabType) {
        currentRef = item[Object.keys(item)[0]];
      }
    });
    const data = currentRef.getInfo();
    return data;
  };

  //筛选方案列表页与新增页切换
  changePage = (page) => {
    this.setState({
      pageStatus: page,
    });
  };

  //从筛选方案页面点击方案名 返回后回填详情
  goDetail = (id) => {
    this.setState(
      {
        pageStatus: 1,
      },
      () => {
        this.childSelect.props.form.setFieldsValue({
          id,
        });
        this.childSelect.handleChangeId(id);
      },
    );
  };

  render() {
    const { indexData, tabType, pageStatus, loadingOff } = this.state;
    return (
      <ContentPackage
        title='资产筛选'
        contentHtml={
          <div className={style.assetPreparation}>
            <div style={{ display: pageStatus == 1 ? 'inherit' : 'none' }}>
              <ProgrammeSelectC
                getDetail={this.getDetail}
                onClear={this.onClear}
                settingInfo={this.settingInfo}
                type={this.state.tabType}
                changePage={this.changePage}
                loadingOff={loadingOff}
                onRef={(ref) => {
                  this.childSelect = ref;
                }}
              />
              {indexData && (
                <Tabs
                  onChange={(val) => {
                    this.setState({ tabType: val });
                  }}
                  activeKey={tabType}
                >
                  {indexData.map((item) => {
                    return (
                      <TabPane tab={item.title} key={item.value}>
                        <CommonComp
                          type={item.value}
                          tabType={tabType}
                          detail={this.state.detail}
                          dataSource={item.children}
                          onRef={(ref) => {
                            this.childRefs.push({
                              [item.value]: ref,
                            });
                          }}
                        />
                      </TabPane>
                    );
                  })}
                </Tabs>
              )}
            </div>
            {pageStatus == 2 && <ScreeningScheme goBack={this.changePage} goDetail={this.goDetail} />}
          </div>
        }
      />
    );
  }
}
export default connect(({ AssetPreparationM, userM: user, loading }) => ({
  AssetPreparationM,
  user,
  loading,
}))(AssetPreparation);
